<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
		<script src="../js/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<input id="inputId" type="text" value="Hello JQuery" />
		
		<script type="text/javascript">
			// JS DOM
			/* var domObj = document.getElementById('inputId');
			console.log(domObj.value);
			console.log(domObj.type);
			domObj.value = 'Hello Java'; */
			// JQuery
			var jQueryObj = $('#inputId');
			// field  property  attr:attribute  
			console.log(jQueryObj.attr('id'));
			console.log(jQueryObj.attr('type'));
			console.log(jQueryObj.attr('value'));
			console.log(jQueryObj.val());
			//jQueryObj.attr('type', 'password');
			//jQueryObj.attr('value', 'Hell Java');
			jQueryObj.val('Hello JS');
			
		</script>
	</body>
</html>
